<template>
  <div class="my-bpmn">
    <bpmn-opt class="bpmn-opt" @back="backHandle" @save="saveHandle"></bpmn-opt>
    <!-- bpmn画布 -->
    <bpmn-wrap class="bpmn-wrap"></bpmn-wrap>
  </div>
</template>

<script>
import BpmnOpt from "./BpmnOpt.vue";
import BpmnWrap from "./BpmnWrap.vue";
export default {
  name: "MyBpmn",
  components: {
    BpmnOpt,
    BpmnWrap,
  },
  methods: {
    backHandle() {
      console.log("返回");
    },
    saveHandle() {
      console.log("保存");
    },
  },
};
</script>

<style lang="scss" scoped>
.my-bpmn {
  display: flex;
  width: 100vw;
  height: 100%;
  flex-direction: column;
  .bpmn-opt {
    width: 100%;
    height: 10%;
    background-color: #330011;
    padding: 10px;
  }
  .bpmn-wrap {
    width: 100%;
    height: 90%;
  }
}
</style>
